<template>
	<view class="cont">
		<view class="text u-p-l-24 u-p-r-24 u-p-t-30 u-tips-color">采购标题：</view>
		<view class="text-bold u-p-24 u-font-30">购买【供暖400㎡+4立方】采购一台采购一台采购一台采购一台采购一台</view>
		<view class="text u-p-l-24 u-p-r-24 u-p-t-20 u-tips-color">
			设置回访提醒<text class="u-p-l-12 text-error">（请设置3分钟以后的时间）</text>：
		</view>
		<view class="radius12 u-p-l-24 bg-white u-m-t-24">
			<u-cell-group :border="false">
				<u-cell-item 
					icon="" 
					title="提醒日期" 
					:value="currentDate || '未设置'"
					class="u-p-l-0"
					@click="showDate = true"></u-cell-item>
				<u-cell-item 
					icon="" 
					title="提醒时间" 
					:value="currentTime || '未设置'"
					class="u-p-l-0"
					:border-bottom="false"
					@click="showTime = true"></u-cell-item>
			</u-cell-group>
		</view>
		<view class="u-p-l-24 u-p-r-24 u-p-t-24 text-error">设置回访时间后，会在该时间向您发送手机短信提醒。</view>
		<view class="fixed">
			<u-button type="success">提交保存</u-button>
		</view>
		
		<!-- 日期 -->
		<u-picker 
			mode="time" 
			v-model="showDate"
			@confirm="confirmDate"></u-picker>
		<u-picker 
			mode="time" 
			:params="{
				year: false,
				month: false,
				day: false,
				hour: true,
				minute: true,
				second: false,
				// 选择时间的时间戳
				timestamp: false
			}"
			v-model="showTime"
			@confirm="confirmTime"></u-picker>
	</view>
</template>

<script>
export default {
	data() {
		return {
			isLogin: false,
			
			status: this.ENUM.SELECTORSTATUS,
			
			showDate: false,
			currentDate: '',
			
			showTime: false,
			currentTime: '',
			
			remark: '',
			
			btnStyle: {
				width: '100%',
				fontSize: '28rpx',
				marginLeft: 0,
			}
		}
	},
	onLoad(query) {
		let check = [1, 3]
		this.status.forEach(item => {
			item.checked = check.indexOf(item.value) > -1
		})
	},
	methods: {
		onCheck(item, index) {
			item.checked = !item.checked
			this.$set(this.status, index, item)
		},
		
		confirmDate(data) {
			this.currentDate = `${data.year}-${data.month}-${data.day}`
		},
		
		confirmTime(data) {
			this.currentTime = `${data.hour}:${data.minute}`
		},
	}
}
</script>

<style lang="scss" scoped>
.cont {
	overflow-x: hidden;
	min-height: 100vh;
	padding-bottom: calc(116rpx + env(safe-area-inset-bottom) / 2);
	::v-deep .u-checkbox {
		flex: 0 0 50% !important;
	}
}
.remark-tip {
	position: absolute;
	bottom: 40rpx;
	right: 50rpx;
}
.fixed {
	padding-bottom: calc(24rpx + env(safe-area-inset-bottom) / 2);
	position: fixed;
	left: 24rpx;
	right: 24rpx;
	bottom: 0;
	z-index: 99;
}
</style>
